/*
 * @Author: 赵鹏霄
 * @Date: 2020-10-20 20:43:37
 * @Last Modified by: mikey.zhaopeng
 * @Last Modified time: 2020-10-20 20:52:01
 */

<template>
  <div id="data">
    <div id="riyue">
      <p> 当日收入总额 / 月收入总额：</p>
      <el-progress :text-inside="true" :stroke-width="22" :percentage="80" status="warning" />
    </div>
    <div id="xinlao">
      <p>新顾客人数 / 老顾客购买量：</p>
      <el-progress type="circle" :percentage="100" status="success" />
    </div>
    <div id="zhuan">
      <p>入店转化率（订单人数/入店人数）：</p>
      <el-progress :percentage="50" />

    </div>
    <p id="jie">
      当日数据显示:
    </p>
  </div>

</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
#data{
  div{
    height: 50%;
    width: 50%;
  }
  position: relative;
  }
  #riyue{
    position: absolute;
    top: 200px;
    left: 50px;
    p{
      color: rgb(8, 250, 129);
    }
  }
  #xinlao{
    position: absolute;
    top: 150px;
    left: 600px;
    p{
      color: peru;
    }
  }
  #zhuan{
    position: absolute;
    top: 200px;
    left: 950px;
    p{
      color: purple;
    }
  }
  #jie{
    font-size: 32px;
    color: blueviolet;
}

</style>
